<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Add a book</title>

<link rel="stylesheet" type="text/css" href="stylesheets/common.css" />
<link rel="stylesheet" type="text/css" href="stylesheets/form.css" />

<script type="text/javascript" src="scripts/prototype.js"></script>
<script type="text/javascript" src="scripts/book.js"></script>

<script type="text/javascript">
	function Init()
	{
		Event.observe($("cover"), "change", OnCoverChange, true);
	}
	Event.observe(window, "load", Init, false);
</script>

</head>
<body>
	<%@ include file="templates/toolbar.jsp"%>
	<form id="addbookform" action="book.do?method=add" method="post" enctype="multipart/form-data">
		<div class="header"><h3>Meta Library</h3></div>
		<div class="content">
			<span id="hint" class="hint">Enter the new book</span>
		
			<div>
				<label for="title">Title:</label>
				<input id="title" name="title" type="text"></input>
			</div>
			
			<div>
				<label for="cover">Cover:</label>
				<img id="coverimg" src="images/book.gif" alt="Book Cover"></img>
				<label for="cover">Upload:</label>
				<input id="cover" name="cover" type="file"></input>
			</div>
			
			<div>
				<label for="author">Author:</label>
				<input id="author" name="author" type="text"></input>
			</div>
			
			<div>
				<label for="press">Press:</label>
				<input id="press" name="press" type="text"></input>
			</div>
			
			<div>
				<label for="isbn">ISBN:</label>
				<input id="isbn" name="isbn" type="text"></input>
			</div>
			
			<div>
				<label for="catalog">Catalog:</label>
				<!-- input id="catalog" name="catalog" type="text"></input-->
				<!-- Generated by jsp -->
				<select id="catalog" name="catalog">
					<option value="dotnet">.Net Framework</option>
					<option value="j2ee">Java EE</option>
					<option value="wince">Windows Mobile</option>
					<option value="dynamic">Python</option>
					<option value="linux">Linux</option>
					<option value="js">JavaScript</option>
					<option value="css">CSS</option>
					<option value="mfc">MFC</option>
				</select>
			</div>
			
			<div>
				<label for="description">Description:</label>
				<textarea id="description" name="description" rows="10"></textarea>
			</div>
			
			<div>
				<label for="copy">Copy:</label>
				<input id="copy" name="copy" type="text"></input>
			</div>
			
			<div id="submitdiv">
				<input id="submitbutton" type="submit" value="Add"></input>
			</div>
		</div>
	</form>
</body>
</html>